<template>
  <section class="my-mine">
    <group>
      <cell v-for="i in list" :key="i.id">
        <div slot="title">
          <p>{{i.title}}</p>
          <p>数量:{{i.num}}</p>
        </div>
        <div>
          <p>
            <span v-if="i.status === 1">已结束</span>
            <span v-else-if="i.status === 2">运行中</span>
            <span v-else="i.status === 3">启用</span>
          </p>
          <p>{{i.time}}</p>
        </div>
      </cell>
    </group>
  </section>
</template>

<script>
  import {Cell, Group} from 'vux'
  export default {
    name: 'Notice',
    components: {
      Cell,
      Group
    },
    data () {
      return {
        list: [
          {id: 1, title: '云网矿机', time: '2018-06-28 12:28', status: 1, num: 30},
          {id: 2, title: '云网矿机', time: '2018-06-28 12:28', status: 2, num: 31},
          {id: 3, title: '云网矿机', time: '2018-06-28 12:28', status: 3, num: 32},
          {id: 4, title: '云网矿机', time: '2018-06-28 12:28', status: 3, num: 33},
          {id: 5, title: '云网矿机', time: '2018-06-28 12:28', status: 1, num: 34},
          {id: 6, title: '云网矿机', time: '2018-06-28 12:28', status: 2, num: 35},
          {id: 7, title: '云网矿机', time: '2018-06-28 12:28', status: 3, num: 36},
          {id: 8, title: '云网矿机', time: '2018-06-28 12:28', status: 2, num: 37},
          {id: 10, title: '云网矿机', time: '2018-06-28 12:28', status: 2, num: 37},
          {id: 9, title: '云网矿机', time: '2018-06-28 12:28', status: 1, num: 38}
        ]
      }
    }
  }
</script>

<style lang="less" scoped>
  .my-mine {
    background-color: #fff;
  }
</style>
